<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="icon/iconfont.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=M0yR79xcbX01fvETk0iuFPi5qauIZ7Ct"></script>
</head>

<body>
    <header>
        <main>
            <div class="logo"><img src="images/logo.png" alt=""></div>
            <div class="nav">
                <ul>
                    <a href="index.html">
                        <li class="active">首页</li>
                    </a>
                    <a href="html/about.html">
                        <li>关于我们</li>
                    </a>
                    <a href="html/product.html">
                        <li>产品介绍</li>
                    </a>
                    <a href="html/team.html">
                        <li>我们团队</li>
                    </a>
                    <a href="">
                        <li>联系我们</li>
                    </a>
                </ul>
            </div>
        </main>
    </header>


    <div class="carousel" id="carousel">
        <div class="pics">
            <img src="images/banner_1.png" alt="" class="active">
            <img src="images/banner_2.jpg" alt="" class="active">
            <img src="images/banner_3.jpg" alt="" class="active">
        </div>
        <img src="images/banner_1.png" alt="" style="opacity:0">
        <ul>
            <li zl="0" class="active"></li>
            <li zl="1"></li>
            <li zl="2"></li>
        </ul>
        <button zl="-1"><i class="iconfont icon-xiangzuojiantou"></i></button>
        <button zl="1"><i class="iconfont icon-xiangyoujiantou"></i></button>
    </div>

    <section>
        <main>
            <div class="section1">
                <div class="title">
                    <div class="ch">关于我们</div>
                    <div class="en">About Us</div>
                    <div class="ico"><img src="images/label.png" alt=""></div>
                </div>
                <div class="box">
                    <div class="left">
                        <div class="pic">
                            <img src="images/about us.png" alt="">
                        </div>
                    </div>
                    <div class="right">
                        <div class="rtitle">公司简介</div>
                        <div class="text">
                            <p> 二十世纪三十年代，巴西咖啡豆生产过剩， 剩余的咖啡豆只能当燃料消耗，非常可惜。 当巴
                                西政府向雀巢公司寻求咖啡豆过剩的解决方法的时候 ， 并没有意识到这最终成就了一个历久弥醇
                                的伟大的咖啡品牌。 1930年，巴西咖啡连续经历了几次大丰收，短期内难以完全销售，便向雀巢
                                求助， 求令咖啡不失香醇的长 期保存方式。 咖啡权威——马克思•莫根特尔(Max Morgenthal
                                er)立刻同他的研究 队伍着手研究，试图制造一种既可以较好保存咖啡芳香又易溶于热水的"固体咖
                                啡"。经过在雀巢瑞士实验室长达七年的不懈努力，30年代末，雀巢向市场推出速溶咖啡，“雀巢
                                咖啡”品牌创立。</p>
                            <p>1988年，雀巢通过考察确定云南适宜种植咖啡，决定支持云南省的咖啡种植。随后于1992年
                                在云南思茅地区成立咖啡农艺服务部，帮助当地发展咖啡种植业。 1997年， 雀巢公司在西双版纳
                                创建试验示范农场，从零开始，让农民得到方方面面的实际培训，大大促进了当地小粒种咖啡豆的
                                发展，并使一个产量低、质量次的咖啡豆产地发展成一个产量高、质量优且已引起全球咖啡界关注
                                的咖啡豆产地。雀巢不仅让农民通过种植咖啡获得了稳定的收入,当地农民通过向雀巢了解国际现货
                                市场价格甚至自己上网查询交易网站的价格，学会根据波动分析销售咖啡的时机。</p>
                        </div>
                    </div>
                </div>
            </div>
        </main>
        <div class="section2">
            <div class="banner">浓香咖啡 让你享受每一个美好的午后时光</div>
        </div>
        <main>
            <div class="section3">
                <div class="title">
                    <div class="ch">产品介绍</div>
                    <div class="en">Product</div>
                    <div class="ico"><img src="images/label.png" alt=""></div>
                </div>
                <div class="boxs">
                    <div class="box">
                        <div class="pic"><img src="#" alt="">
                            <div class="shadow"><img src="images/fdj.png" alt=""></div>
                        </div>
                        <div class="text">
                            <div class="ttitle"></div>
                            <div class="content"></div>
                        </div>
                    </div>
                    <div class="box">
                        <div class="pic"><img src="#" alt="">
                            <div class="shadow"><img src="images/fdj.png" alt=""></div>
                        </div>

                        <div class="text">
                            <div class="ttitle"></div>
                            <div class="content"></div>
                        </div>
                    </div>
                    <div class="box">
                        <div class="pic"><img src="#" alt="">
                            <div class="shadow"><img src="images/fdj.png" alt=""></div>
                        </div>
                        <div class="text">
                            <div class="ttitle"></div>
                            <div class="content"></div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="section4">
                <div class="title">
                    <div class="ch">公司团队</div>
                    <div class="en">Our team</div>
                    <div class="ico"><img src="images/label.png" alt=""></div>
                </div>
                <div class="boxs">
                    <div class="box">
                        <div class="pic"><img src="images/team_1.png" alt=""></div>
                        <div class="active b1">
                            <div class="ttitle"></div>
                            <div class="enname" style="display: none;"></div>
                            <div class="content">
                                </div>
                        </div>
                    </div>
                    <div class="box">
                        <div class="pic"><img src="images/team_2.png" alt=""></div>
                        <div class="text b1">
                            <div class="ttitle"></div>
                            <div class="enname"></div>
                            <div class="content" style="display: none;">
                                </div>
                        </div>
                    </div>
                    <div class="box">
                        <div class="pic"><img src="images/team_3.png" alt=""></div>
                        <div class="text b1">
                            <div class="ttitle"></div>
                            <div class="enname"></div>
                            <div class="content" style="display: none;">
                                </div>
                        </div>
                    </div>
                    <div class="box">
                        <div class="pic"><img src="images/team_4.png" alt=""></div>
                        <div class="text b1">
                            <div class="ttitle"></div>
                            <div class="enname"></div>
                            <div class="content" style="display: none;">
                                </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="section5">
                <div class="title">
                    <div class="ch">联系我们</div>
                    <div class="en">Contact us</div>
                    <div class="ico"><img src="images/label.png" alt=""></div>
                </div>
                <div class="bottom">
                    <div class="left">
                        <div id="allmap" style="overflow: hidden;width:662px;height:344px"></div>
                    </div>
                    <div class="right">
                        <div class="box">
                            <div class="pic"><img src="images/phone.png" alt=""></div>
                            <div class="text">
                                <p class="p1">资讯热线</p>
                                <p class="p2">Information Hotline</p>
                                <p class="p3">重庆：+86 023-867-7848</p>
                                <p class="p4">(09：30~18：30 北京时间)</p>
                            </div>
                        </div>
                        <div class="box">
                            <div class="pic"><img src="images/map.png" alt=""></div>
                            <div class="text">
                                <p class="p1">公司地址</p>
                                <p class="p2">Company address</p>
                                <p class="p3">地址：重庆大坪龙湖时代天街3号写字楼2407室</p>
                                <p class="p4">(09：30~18：30 北京时间)</p>
                            </div>
                        </div>
                        <div class="box">
                            <div class="pic"><img src="images/email.png" alt=""></div>
                            <div class="text">
                                <p class="p1">公司邮箱</p>
                                <p class="p2">E-mail</p>
                                <p class="p3">邮箱：info@haitouglobal.com</p>
                                <p class="p4">(09：30~18：30 北京时间)</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </main>
    </section>

    <footer>
        <main>
            <div class="left">Copyright &copy; 重庆duzu有限公司 | duzu备案号 33010602001878 号 版权所有：重庆戈登有限公司</div>
            <div class="right"><img src="images/logo_buttom.png" alt=""></div>
        </main>
    </footer>

</body>
<script>
	// 百度地图API功能
	var map = new BMapGL.Map("allmap");
	var point = new BMapGL.Point(106.490916,29.53781);
	map.centerAndZoom(point, 19);
	
	var marker = new BMapGL.Marker(point);  // 创建标注
	map.addOverlay(marker);              // 将标注添加到地图中
	var opts = {
	    width : 200,     // 信息窗口宽度
	    height: 100,     // 信息窗口高度
	    title : "重庆千锋" , // 信息窗口标题
	    message:"这里是重庆千锋"
	}
	var infoWindow = new BMapGL.InfoWindow("地址：重庆市九龙坡区科园一路2号12层", opts);  // 创建信息窗口对象 
	marker.addEventListener("click", function(){          
		map.openInfoWindow(infoWindow, point); //开启信息窗口
	}); 
    map.openInfoWindow(infoWindow, point); //开启信息窗口
</script>
<script src="js/index.js"></script>

</html>